<template>
    <div class="page">
        <el-pagination background :page-sizes="[10, 20, 50, 100]" layout="total, sizes, prev, pager, next, jumper"
            :total="total" :current-page="page" :page-size="page_size" @size-change="sizeChange"
            @current-change="currentChange">
        </el-pagination>
    </div>
</template>

<script>
export default {
    props: ['page', 'page_size', 'total'],
    data() {
        return {

        }
    },
    created() {

    },
    methods: {
        currentChange(page) {
            this.$emit('currentChange', page)
        },
        sizeChange(size) {
            this.$emit('sizeChange', size)
        },
    },
}
</script>

<style lang='scss' scoped>
.page {
    margin-top: 18px;
    display: flex;
    justify-content: end;
}
</style>